import _ from 'lodash';
import printMe from './print.js';
import './style.css';
// require('style-loader!css-loader!./style.css');
import {cube} from './math.js';

if (process.env.NODE_ENV !== 'production') {
    console.log('Looks like we are in development mode!');
}

function component() {
    let element = document.createElement('div');
    var ele_pre = document.createElement('pre');
    ele_pre.innerHTML = [
        'Hello webpack!',
        '5 cubed is equal to ' + cube(50)
    ].join('\n\n');
    let btn = document.createElement('button');
    element.innerHTML = _.join(['Hello', 'webpack', 'nodejs'], ' ');
    btn.innerHTML = 'Click me and check the console!';
    btn.onclick = printMe;
    element.appendChild(btn);
    element.appendChild(ele_pre);
    return element;
}

let element = component(); // Store the element to re-render on print.js changes
document.body.appendChild(element);

if (module.hot) {
    module.hot.accept('./print.js', function () {
        console.log('Accepting the updated printMe module!');
        document.body.removeChild(element);
        element = component(); // Re-render the "component" to update the click handler
        document.body.appendChild(element);
    })
}
